//index.js
let ctx;
Page({

  /**
   * 页面的初始数据
   */
  data: {
    pen:{
      lineWidth:5,
      color:'#c03'
    }
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    ctx = wx.createCanvasContext('myCanvas',this);
    ctx.setStrokeStyle(this.data.pen.color);
    ctx.setLineWidth(this.data.pen.lineWidth);
    ctx.setLineCap('round');
    ctx.setLineJoin('round');

  },
  //开始绘图
  touchStart(e){
    ctx.setStrokeStyle(this.data.pen.color);
    ctx.setLineWidth(this.data.pen.lineWidth);
    ctx.moveTo(e.touches[0].x, e.touches[0].y);
  },
  //移动
  touchMove(e){
    ctx.lineTo(e.touches[0].x, e.touches[0].y);
    ctx.stroke();
    ctx.draw(true);
    ctx.moveTo(e.touches[0].x, e.touches[0].y);
  },
  //设置笔型
  penSelect(e){
    this.setData({ 'pen.lineWidth': e.currentTarget.dataset.param})
  },
  //设置笔色
  colorSelect(e){
    this.setData({ 'pen.color': e.currentTarget.dataset.param })
  }
})